/**
 * @class L.Control.Draw
 * @aka L.Draw
 */
L.Control.Draw = L.Control.extend({

  // Options
  options: {
    position: 'topleft',
    draw: {},
    edit: false
  },

  // @method initialize(): void
  // Initializes draw control, toolbars from the options
  initialize: function (options) {
    if (L.version < '0.7') {
      throw new Error('Leaflet.draw 0.2.3+ requires Leaflet 0.7.0+. Download latest from https://github.com/Leaflet/Leaflet/');
    }

    L.Control.prototype.initialize.call(this, options);

    var toolbar;

    this._toolbars = {};

    // Initialize toolbars
    if (L.DrawToolbar && this.options.draw) {
      toolbar = new L.DrawToolbar(this.options.draw);

      this._toolbars[L.DrawToolbar.TYPE] = toolbar;

      // Listen for when toolbar is enabled
      this._toolbars[L.DrawToolbar.TYPE].on('enable', this._toolbarEnabled, this);
    }

    if (L.EditToolbar && this.options.edit) {
      toolbar = new L.EditToolbar(this.options.edit);

      this._toolbars[L.EditToolbar.TYPE] = toolbar;

      // Listen for when toolbar is enabled
      this._toolbars[L.EditToolbar.TYPE].on('enable', this._toolbarEnabled, this);
    }
    L.toolbar = this; //set global var for editing the toolbar
  },

  // @method onAdd(): container
  // Adds the toolbar container to the map
  onAdd: function (map) {
    var container = L.DomUtil.create('div', 'leaflet-draw'),
      addedTopClass = false,
      topClassName = 'leaflet-draw-toolbar-top',
      toolbarContainer;

    for (var toolbarId in this._toolbars) {
      if (this._toolbars.hasOwnProperty(toolbarId)) {
        toolbarContainer = this._toolbars[toolbarId].addToolbar(map);
        if (toolbarContainer) {

          if (!addedTopClass) {
            if (!L.DomUtil.hasClass(toolbarContainer, topClassName)) {
              L.DomUtil.addClass(toolbarContainer.childNodes[0], topClassName);
            }
            addedTopClass = true;
          }
          container.appendChild(toolbarContainer);
          if (toolbarId == "draw") {
            this.a_polyline = toolbarContainer.children[0].children[0];
            this.a_polygon = toolbarContainer.children[0].children[1];
            this.a_rectangle = toolbarContainer.children[0].children[2];
            this.a_circle = toolbarContainer.children[0].children[3];
            this.a_marker = toolbarContainer.children[0].children[4];
            this.a_circlemarker = toolbarContainer.children[0].children[5];

            //创建收起图标
            this._draw_div_updown = L.DomUtil.create('a', '');
            this._draw_div_updown.style = "background-image:none;font-size:16px;";
            this._draw_div_updown.title = "收起工具";
            this._draw_iupdown = L.DomUtil.create('i', '', this._draw_div_updown);
            L.DomUtil.addClass(this._draw_iupdown, "el-icon-caret-top");
            L.DomEvent.addListener(this._draw_div_updown, 'click', this.upDownImgClick, this);

            if (this.options.draw.list) {
              let listButton = L.DomUtil.create('a', '');
              listButton.style = "background-image:none;font-size:16px;";
              listButton.title = "显示/隐藏列表";
              let icon = L.DomUtil.create('i', '', listButton);
              L.DomUtil.addClass(icon, "el-icon-notebook-2");
              L.DomEvent.addListener(listButton, 'click', this.options.draw.list.click, this);
              toolbarContainer.children[0].insertBefore(listButton, toolbarContainer.children[0].children[0]);
            }

            toolbarContainer.children[0].insertBefore(this._draw_div_updown, toolbarContainer.children[0].children[0]);
          }
        }
      }
    }

    return container;
  },

  // @method onRemove(): void
  // Removes the toolbars from the map toolbar container
  onRemove: function () {
    for (var toolbarId in this._toolbars) {
      if (this._toolbars.hasOwnProperty(toolbarId)) {
        this._toolbars[toolbarId].removeToolbar();
      }
    }
  },
  upDownImgClick: function () {
    //this._map.fire('onMapClearClick', {});
    if (!this._toolbarHiding) {
      this._toolbarHiding = true;
      L.DomUtil.removeClass(this.a_polyline.parentNode, 'leaflet-toolbar-show');
      L.DomUtil.addClass(this.a_polyline.parentNode, 'leaflet-toolbar-hide');

      L.DomUtil.removeClass(this._draw_iupdown, "el-icon-caret-top");
      L.DomUtil.addClass(this._draw_iupdown, "el-icon-caret-bottom");
      this._draw_div_updown.title = "展开工具";
    } else {
      this._toolbarHiding = false;
      L.DomUtil.removeClass(this.a_polyline.parentNode, 'leaflet-toolbar-hide');
      L.DomUtil.addClass(this.a_polyline.parentNode, 'leaflet-toolbar-show');
      L.DomUtil.removeClass(this._draw_iupdown, "el-icon-caret-bottom");
      L.DomUtil.addClass(this._draw_iupdown, "el-icon-caret-top");
      this._draw_div_updown.title = "收起工具";
    }
  },
  // @method setDrawingOptions(options): void
  // Sets options to all toolbar instances
  setDrawingOptions: function (options) {
    for (var toolbarId in this._toolbars) {
      if (this._toolbars[toolbarId] instanceof L.DrawToolbar) {
        this._toolbars[toolbarId].setOptions(options);
      }
    }
  },

  _toolbarEnabled: function (e) {
    var enabledToolbar = e.target;

    for (var toolbarId in this._toolbars) {
      if (this._toolbars[toolbarId] !== enabledToolbar) {
        this._toolbars[toolbarId].disable();
      }
    }
  }
});

L.Map.mergeOptions({
  drawControlTooltips: true,
  drawControl: false
});

L.Map.addInitHook(function () {
  if (this.options.drawControl) {
    this.drawControl = new L.Control.Draw();
    this.addControl(this.drawControl);
  }
});
